import TemplateEngine from "./templateEngine";

const templateStr = `
    <ul>
        {{#arr}}
        <li>
            <div class="hd">{{name}}的基本信息</div>
            <div class="bd">
                <p>姓名：{{name}}</p>
                <p>年龄：{{age}}</p>
                <p>性别：{{sex}}</p>
                <p>爱好：
                <ol>
                    {{#hobbies}}
                    <li>{{.}}</li>
                    {{/hobbies}}
                </ol>
                </p>
            </div>
        </li>
        {{/arr}}
    </ul>
`;

const data = {
    arr: [
        {name: "小明", age: 12, sex: "男", hobbies: ["游泳", '潜水', '画画']},
        {name: "小红", age: 11, sex: "女", hobbies: ["篮球", '足球']},
        {name: "小强", age: 13, sex: "男", hobbies: ["跑步"]},
    ]
};

const templateEngine = new TemplateEngine(templateStr, data);

templateEngine.render(templateStr, data).$mounted('#app');